<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <meta http-equiv="X-UA-Compatible" content="ie=edge">
    <title>牛魔王装饰手机官网</title>
    <link rel="stylesheet" href="./css/base.css">
    <link rel="stylesheet" href="./js/swiper/css/swiper.min.css">
    <link rel="stylesheet" href="./css/homepage.css">
</head>
<body>
    <div class="nmw_layout">
        <!-- 顶部导航 -->
                
        <div class="guide">
            <div class="guideContainer clearfix m">
                <div class="guide_left">
                    <a href="#">
                        <span class="guide_locate"></span>
                        <span>长沙</span>
                    </a>
                </div>
                <div class="guide_right">
                    <a href="#" class="guide_navigation_contact">

                    </a>
                </div>
                <div class="guide_middle"></div>
            </div>
        </div>
        <!-- swiper -->
        <div class="swiper-container">
            <div class="swiper-wrapper">
                <div class="swiper-slide">
                    <img src="./images/homepage/banner1.jpg" alt="" width="100%">
                </div>
                <div class="swiper-slide">
                    <img src="./images/homepage/banner2.jpg" alt="" width="100%">
                </div>
                <div class="swiper-slide">
                    <img src="./images/homepage/banner1.jpg" alt="" width="100%">
                </div>
            </div>
            <!-- 如果需要分页器 -->
            <div class="swiper-pagination"></div>
        </div>


        <!-- 中心导航 -->
        <nav class="nav clearfix">
            <a class="nav_b">
                <img src="./images/homepage/nav_1.jpg" alt="">
                <div>优惠活动</div>
            </a>
            <a class="nav_b">
                <img src="./images/homepage/nav_2.jpg" alt="">
                <div>精选案例</div>
            </a>
            <a class="nav_b">
                <img src="./images/homepage/nav_3.jpg" alt="">
                <div>10秒报价</div>
            </a>
            <a class="nav_b">
                <img src="./images/homepage/nav_4.png" alt="">
                <div>查看更多</div>
            </a>
        </nav>

        <!-- 图片列表 -->
        <div class="imgList">
            <div class="imgList1">
                <div class="imgList_title">
                <span>
                    <img src="./images/homepage/product_title.png" alt="" width="18">
                </span>
                    <span>重归经典 基础装修包</span>
                </div>
                <div class="imgList_img">
                    <img src="./images/homepage/product_img1.png" alt="" class="product_img1">
                    <img src="./images/homepage/product_img2.png" alt="" class="product_img2">
                </div>
            </div>
            <div class="imgList1">
                <div class="imgList_title">
                <span>
                    <img src="./images/homepage/product_title.png" alt="" width="18">
                </span>
                    <span>新品上市 装修一口价</span>
                </div>
                <div class="imgList_img">
                    <img src="./images/homepage/product_img3.png" alt="" class="product_img1">
                    <img src="./images/homepage/product_img4.png" alt="" class="product_img3">
                </div>
            </div>
        </div>

        <!-- 精选高清案例 -->
        <div class="case">
            <div class="caseTitle clearfix">
                <div class="caseTitle_left">
                    <img src="./images/homepage/case_icon.png" alt="" width="18">
                    <span>精选高清案例</span>
                </div>
                <div class="caseTitle_right">
                    <a href="#">
                        <span>更多</span>
                        <i> > </i>
                    </a>
                </div>
            </div>
            <div class="caseImg">
                <ul class="caseImgList clearfix">
                    <li>
                        <img src="./images/homepage/case_1.jpg" alt="">
                    </li>
                    <li>
                        <img src="./images/homepage/case_2.jpg" alt="">
                    </li>
                    <li>
                        <img src="./images/homepage/case_3.jpg" alt="">
                    </li>
                    <li>
                        <img src="./images/homepage/case_4.jpg" alt="">
                    </li>
                    <li>
                        <img src="./images/homepage/case_5.jpg" alt="">
                    </li>
                    <li>
                        <img src="./images/homepage/case_6.jpg" alt="">
                    </li>
                    <li>
                        <img src="./images/homepage/case_7.jpg" alt="">
                    </li>
                </ul>
            </div>
            <p class="caseImg_line"></p>
        </div>

        <!-- 计算器 -->
        <div class="calc">
            <div class="calcTitle clearfix">
                <div class="caleTitle_left">
                    <a href="#">
                        <img src="./images/homepage/calc_icon.jpg" alt="" width="18">
                        <span>装修计算器</span>
                    </a>
                </div>
                <div class="caleTitle_right">
                    <span>已有 <i>10365</i> 位业主获得报价</span>
                </div>
            </div>
            <div class="caleContent">
                <div class="caleContent_top">
                    <a href="#">
                        <span class="caleContent_bold">10秒估算装修预算</span>
                        <span>专业 透明 公正的装修报价</span>
                    </a>
                </div>
                <div class="caleContent_bottom m">
                    <div class="calc_form">
                      <input type="text" class="btn1" placeholder="请输入您的名字">
                      <input type="text" class="btn2" placeholder="请输入您的手机号码">
                      <input type="text" class="btn3" placeholder="请输入您的房屋面积">
                      <button class="btn4">立即报价 / 短信接收装修报价</button>
                      <div class="maintain">
                        <img src="./images/homepage/calc_ensure.jpg" alt="">
                        <span>我们承诺会严格保密您的信息 , 请放心填写!</span>
                      </div>
                    </div>
                </div>
            </div>
        </div>

        <!-- 底部说明 -->
        <div class="footer">
            <div class="footerTel">
                <span>官方服务电话: 400-0011-951</span>
            </div>
            <div class="footerServe">
                <div class="footerServe_city">
                    <p>服务全国: 北京 | 长沙 | 武汉 | 杭州 | 益阳 | 深圳 </p>
                    <p>上海 | 湘潭 | 株洲 | 常德</p>
                    <p>ⓒ 2014-2017 Hunan niumowang decoration engineering co.LTD.</p>
                    <p>All rights reserved. 湘ICP备16021727号-1</p>
                </div>
            </div>
        </div>

      <!--底部导航-->
      <div class="bottom_menu">
        <ul class="bottom_menuList">
          <li>
            <a href="#">
              <img src="./images/homepage/footer1.png" alt="">
              <p>返回首页</p>
            </a>
          </li>
          <li>
            <a href="#">
              <img src="./images/homepage/footer2.png" alt="">
              <p>装修报价</p>
            </a>
          </li>
          <li>
            <a href="#">
              <img src="./images/homepage/footer3.png" alt="">
              <p>免费电话</p>
            </a>
          </li>
          <li>
            <a href="#">
              <img src="./images/homepage/footer4.png" alt="">
              <img src="./images/homepage/footer_point.gif" alt="" class="footer_point" width="15">
              <p>在线客服</p>
            </a>
          </li>
        </ul>
      </div>

        <!--弹窗-->
        <div class="popup">
            <div class="popupContainer">
                <ul class="popupContainerList">
                    <li>
                        <a href="#">
                            <img src="./images/homepage/alert_1.png" alt="">
                            <p>优惠活动</p>
                        </a>
                    </li>
                    <li>
                        <a href="#">
                            <img src="./images/homepage/alert_2.png" alt="">
                            <p>精选案例</p>
                        </a>
                    </li>
                    <li>
                        <a href="#">
                            <img src="./images/homepage/alert_3.png" alt="">
                            <p>10秒报价</p>
                        </a>
                    </li>
                    <li>
                        <a href="#">
                            <img src="./images/homepage/alert_4.png" alt="">
                            <p>免费量房</p>
                        </a>
                    </li>
                    <li>
                        <a href="#">
                            <img src="./images/homepage/alert_5.png" alt="">
                            <p>找设计师</p>
                        </a>
                    </li>
                    <li>
                        <a href="#">
                            <img src="./images/homepage/alert_6.png" alt="">
                            <p>免息贷款</p>
                        </a>
                    </li>
                    <li>
                        <a href="#">
                            <img src="./images/homepage/alert_7.png" alt="">
                            <p>老房改造</p>
                        </a>
                    </li>
                    <li>
                        <a href="#">
                            <img src="./images/homepage/alert_8.png" alt="">
                            <p>新房装修</p>
                        </a>
                    </li>
                    <li>
                        <a href="#">
                            <img src="./images/homepage/alert_9.png" alt="">
                            <p>工艺标准</p>
                        </a>
                    </li>
                </ul>
                <div class="alert_close">

                </div>
                <div class="alert_tel">
                    <img src="./images/homepage/alert_tel.png" alt="" width="9">
                    <span>官方电话 : 400-0011-951</span>
                </div>
            </div>
        </div>
    </div>
<script src="./js/jquery.js"></script>
<script src="./js/swiper/js/swiper.min.js"></script>
<script src="./js/index.js"></script>
</body>
</html>